<template>
	<v-layout type="main">
		<el-form ref="form" :model="addForm" :rules="submitRules" label-width="120px" class="alick-add-form">
			<div>
				<h3 class="add-alike-title">基本信息</h3>
				<el-form-item label="名称" prop="name">
					<el-input type="text" v-model="addForm.name" />
				</el-form-item>
				<el-form-item label="别名" prop="alias">
					<el-input type="text" v-model="addForm.alias" />
				</el-form-item>
				<el-form-item label="配图">
					<media-uploader accept=".jpg,.jpeg,.png,.JPG,.JPEG" :src="addForm.avatar" @avatarPath="avatarPath" />
				</el-form-item>
				<el-form-item label="描述" prop="desc">
					<el-input type="textarea" :rows="6" v-model="addForm.desc" />
				</el-form-item>
				<el-form-item label="标签类型" prop="labels">
					<el-select
						v-model="addForm.labels"
						style="width:100%;"
						:popper-append-to-body="false"
						popper-class="select-popper"
						placeholder="请选择"
					>
						<el-option v-for="item in labelDicts" :key="item.value" :label="item.label" :value="item.value">
						</el-option>
					</el-select>
				</el-form-item>
			</div>
			<h3 class="add-alike-title">版本信息</h3>
			<el-form-item label="版本" prop="version">
				<el-input type="text" v-model="addForm.version" readonly />
			</el-form-item>
			<el-form-item label="提交信息" prop="commit_msg">
				<el-input type="textarea" :rows="6" v-model="addForm.commit_msg" />
			</el-form-item>

			<el-form-item label=" ">
				<el-button type="primary" class="none-type" @click="submit">确定</el-button>
			</el-form-item>
		</el-form>
	</v-layout>
</template>
<script>
import { labelDicts } from "@/utils/maps";
import { getMarketModelDetail, addMarketModel } from "@/api/marketModel";
import { getModelDetail } from "@/api/model";
import { addMarketModelVersion } from "@/api/marketModelVersion";
export default {
	data() {
		return {
			active: 1,
			addForm: {
				name: "",
				alias: "",
				desc: "",
				file_source: 1,
				engineVisibility: 2,
				type: 1,
			},
			model: {},
			submitRules: {
				name: [
					{ required: true, message: "该项为必填项" },
					{ required: true, min: 1, max: 200, message: "长度在1到40个字符" },
				],
				desc: [
					{ required: true, message: "该项为必填项" },
					{ required: true, min: 1, max: 200, message: "长度在1到200个字符" },
				],
				commit_msg: [
					{ required: true, message: "该项为必填项" },
					{ required: true, min: 1, max: 200, message: "长度在1到200个字符" },
				],
			},
			labelDicts,
			model_id: this.$route.query.model_id,
			model_version_id: this.$route.query.model_version_id,
			market_model_id: this.$route.query.market_model_id,
		};
	},
	async created() {
		this.getDetail();
	},
	mounted() {},
	destroyed() {},
	methods: {
		async getDetail() {
			let version = "v1";
			//console.log(this.market_model_id,this.model_id)
			if (this.market_model_id) {
				let res = await getMarketModelDetail({ id: this.market_model_id });
				this.model = res.data;
				this.addForm = { ...this.addForm, ...this.model };
				version = "v" + (res.data.version_index + 1);
			} else if (this.model_id) {
				let res = await getModelDetail({ id: this.model_id });
				let data = res.data;
				this.addForm.alias = data.alias;
				this.addForm.avatar = data.avatar;
				this.addForm.name = data.name;
				this.addForm.desc = data.desc;
				this.addForm.source = data.id;
				this.addForm.labels = data.labels;
			}
			this.addForm.version = version;
			this.$forceUpdate();
		},
		/**
		 * 提交
		 */
		submit() {
			this.$refs.form.validate(async (valid) => {
				//console.log(valid,this.market_model_id)
				if (valid) {
					if (this.market_model_id == null) {
						let res = await addMarketModel({ ...this.addForm });
						this.market_model_id = res.data.id;
					}
					let versionForm = {};
					versionForm.model_id = this.market_model_id;
					versionForm.source = this.model_version_id;
					versionForm.version = this.addForm.version;
					versionForm.commit_msg = this.addForm.commit_msg;
					var result = await addMarketModelVersion(versionForm);
					/*let query = { model_id: this.addForm.id, version: 1, model_version_id: this.model_version_id }
                    this.$router.push({
                        path: '/market/modelcode',
                        query
                    })*/
					console.log("result", result, this.model_id);
					// let query = { id: this.model_id}
					// this.$router.push({
					//     path: '/model/code',
					//     query
					// })
					let query = { active: 2 };
					this.$router.push({
						path: "/my_market",
						query,
					});
				}
			});
		},

		addModelVersion() {
			let query = { model_id: this.model_id, version: this.version, source: this.source };
			this.$router.push({
				path: "/market/modelversionsdetail",
				query,
			});
		},
		toDetail() {
			let query = {
				id: this.id,
			};
			this.$router.push({
				path: "/market/modelcode",
				query,
			});
		},
		done() {
			this.toDetail();
		},

		succeedOver(data) {
			console.log(data);
		},
		avatarPath(data) {
			this.addForm.avatar = data;
		},
	},
};
</script>
<style lang="less" scoped>
.el-form {
	margin-top: 20px;
}

.succeed-hit {
	text-align: center;
	line-height: 120px;
	font-size: 28px;
	font-weight: bold;
	padding-top: 80px;
}

.succeed-btn {
	width: 120px;
	margin: 40px auto 0;

	a {
		display: block;
		text-align: center;
		line-height: 40px;
		border-radius: 4px;
		background: #409eff;
		color: #fff;
	}
}
</style>
